<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('查看大屏元素JSON')" />
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">

    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>样式JSON <small class="m-l-sm">查看大屏元素的样式JSON</small></h5>
                </div>
                <div class="ibox-content">
                    <p id="show_p" th:text="${cssStyle}">{ "name": "Brett", "address":"北京路23号", "email": "123456@qq.com" }</p>
                    <pre id="out_pre"></pre>
                </div>
            </div>
        </div>
    </div>

</div>
<th:block th:include="include :: footer" />
<script type="text/javascript">

    var text = document.getElementById('show_p').innerText; //获取json格式内容

    var result = JSON.stringify(JSON.parse(text), null, 2);//将字符串转换成json对象

    document.getElementById('out_pre').innerText= result ;


</script>
</body>
</html>
